/*
 * @Author: your name
 * @Date: 2020-07-26 22:08:43
 * @LastEditTime: 2020-07-27 22:03:07
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \ts\react-router-app\src\pages\list_page.js
 */

 import React, { Component } from 'react';
import {Link} from 'react-router-dom'

 import './list_page.css'
 class ListPage extends Component {
   constructor(props) {
     super(props);
     this.state = {
       listData:[1,2,3,4,5,6,7,8,9]
     };
   }
   render() {
     return (
        <ul className="pageContent">
          {
            this.state.listData.map(elm=>{
              return <li className="itemStyle" key={'list'+ elm }>
                <Link to={'/list/' + elm} style={{display:"block",width:"100%",height:"100%"}}>{elm}</Link>
              </li>
            })
          }


        </ul>
     );
   }
 }

 export default ListPage;
